<template>
	<u-navbar title="学生签名" left-icon-color="white" :placeholder="true" title-style="color:white" bgColor="#359FE3"
			:autoBack="true"></u-navbar>
	<view class="w-screen h-screen">
		<view class=" w-full h-full">
			<l-signature disableScroll  ref="signatureRef" :penColor="penColor" :penSize="penSize" :openSmooth="openSmooth" ></l-signature>
		</view>
		
		
		<view class="fixed w-full p-3 bottom-0 flex justify-center item-center bg-gray-200">
		    <button size="mini" type="primary" @click="action('clear')">清空</button>
		    <button size="mini" type="primary" @click="action('undo')">撤消</button>
		    <button size="mini" type="primary" @click="action('save')">下一步</button>
		</view>
	</view>
		
</template>

<script>
	export default {
		data() {
			return {
				openSmooth:true,
				base64:'',
				penColor:'black',
				penSize:12
			}
		},
		onShow() {
		},
		methods: {
			action(type) {
						 if(type == 'openSmooth') {
							 this.openSmooth = !this.openSmooth
							 return
						 }
						if (type == 'save') {
							this.$refs.signatureRef.canvasToTempFilePath({
								success: (res) => {
									// 是否为空画板 无签名
									console.log(res.isEmpty)
									// 生成图片的临时路径
									// H5 生成的是base64
									this.base64 = res.tempFilePath
									uni.setStorageSync('studentSign',this.base64)
									uni.navigateTo({
										url:'/pages/studentSign/studentSign'
									})
								}
							})
							return
						}
						if (this.$refs.signatureRef)
							this.$refs.signatureRef[type]()
					}	
			}
	}
</script>

<style>

</style>
